/**
 * Created by lenovo on 2017/2/21.
 */
/**
 * Created by lenovo on 2017/2/17.
 */

var oooo=0;
var pic = 0;
var mmmm=[];
function getEgg() {
    $.get("http://139.199.157.195:9090/api/getcouponproduct?couponid="+oooo, function (res) {
        var html = template("menuTpl", res);
        $("#chook").html(html)

        mmmm=[];
        pic=0;
        for (i=0;i<res.result.length;i++ ){
            mmmm.push(res.result[i].couponProductImg);
        }
        getPicture();
        movePicture();
        togglePicture();
        $("#middle-skip>option")[0].selected=false;
        $("#middle-skip>option")[oooo].selected=true;
    })
}
function leftEgg() {
    $("#page-skip>td:nth-child(1)").click(function () {
        if(oooo-1<0){
            alert("已经是第一页烙！！！");
            return;
        }
        oooo--;
        getEgg();
    })
}
function middleEgg(){
    $("select").on("change", function () {
        oooo=this.value-1;
        getEgg();
    })
}
function rightEgg() {
    $("#page-skip>td:nth-child(3)").click(function () {
        if(oooo+1>19){
            alert("已经是最后一页烙！！！");
            return;
        }
        oooo++;
        getEgg();
    })
}
//轮播图之获取图片
function getPicture(){
    $("#imgList").html("");
    for(i=0;i<mmmm.length;i++ ){
        var li=document.createElement("li");
        $(li).html(mmmm[i]);
        $("#imgList").append($(li));
    }
}
//轮播图之动画效果
function movePicture(){
    var box = document.getElementById("box");
    var ad = box.children[0];
    var ul = document.getElementById("imgList");
    var lis = ul.children;
    var arr = document.getElementById("move-arr");
    var left = document.getElementById("move-left");
    var right = document.getElementById("move-right");
    var imgWidth = 300;

    //点击右箭头 移动ul
    right.onclick = function () {
        if (pic === lis.length - 1) {
            return;
        }
        pic++;
        var target = -pic * imgWidth;
        animate(ul, target);
    };
    //点击左箭头
    left.onclick = function () {
        if (pic === 0) {
            return;
        }
        pic--;
        var target = -pic * imgWidth;
        animate(ul, target);
    };


    function animate(obj, target) {
        clearInterval(obj.timer);
        obj.timer = setInterval(function () {
            var leader = obj.offsetLeft;
            var step = 30;
            step = leader < target ? step : -step;
            if (Math.abs(target - leader) >= Math.abs(step)) {
                leader = leader + step;
                obj.style.left = leader + "px";
            } else {
                obj.style.left = target + "px";
                clearInterval(obj.timer);
            }
        }, 15);
    }
}

//轮播图之当前图片显示效果
function togglePicture(){
    for(i=0;i<$("#chook").children().length;i++ ){
        var chooks = $("#chook").children();
        chooks[i].index = i;

        chooks[i].onclick = function(){
            console.log(this.index);
            pic=this.index;
            $("#imgList")[0].style.left=-(pic*300)+"px";
            //点击出现，点击消失
            $("#father")[0].style.display = "block";
        }
        $("#box")[0].onclick=function(){
            $("#father")[0].style.display = "none";
        }
    }
}
getEgg();
leftEgg();
middleEgg();
rightEgg();